<template>
  <div class="app-wrap">
    <router-view></router-view>
    <div>
      <!-- <Loan v-if="currentIndex==1"></Loan>
      <Bill v-if="currentIndex==2"></Bill>
      <Mine v-if="currentIndex==3"></Mine> -->
    </div>
    <div class="appBar">
      <div @click="chanegIndex(1)" :class="{ 'active': currentIndex == 1 }">
        <img v-if="currentIndex == 1" src="~@/assets/imgs/market/icon_loan_active.png" alt="">
        <img v-else src="~@/assets/imgs/market/icon_loan.png" alt="">
        <div>LOAN</div>
      </div>
      <div @click="chanegIndex(2)" :class="{ 'active': currentIndex == 2 }">
        <img v-if="currentIndex == 2" src="~@/assets/imgs/market/icon_bill_active.png" alt="">
        <img v-else src="~@/assets/imgs/market/icon_bill.png" alt="">
        <div>BILL</div>
      </div>
      <div @click="chanegIndex(3)" :class="{ 'active': currentIndex == 3 }">
        <img v-if="currentIndex == 3" src="~@/assets/imgs/market/icon_main_active.png" alt="">
        <img v-else src="~@/assets/imgs/market/icon_main.png" alt="">
        <div>MINE</div>
      </div>
    </div>
  </div>
</template>
<script>
// import Loan from './components/loan';
// import Bill from './components/bill';
// import Mine from './components/mine';
export default {
  name: 'home',
  components: {
    // Loan,
    // Bill,
    // Mine
  },
  created() {
    // ?code=9ccd9a6d424940d18ca7c1b5397ab1fc&userId=12622135&phone=09258863863

    let path = this.$route.path;
    let query = this.$route.query;
    if (path == '/home') {
      this.currentIndex = 1;
      if (query.code) {
        this.$storage.set('user', {
          code: query.code || '',
          phone: query.phone || '',
          userId: query.userId || ''
        });
      } else {
        this.$storage.set('user', {});
      }
    }
    if (path == '/bill') {
      this.currentIndex = 2;
    }
    if (path == '/mine') {
      this.currentIndex = 3;
    }
  },
  beforeRouteUpdate(to, from, next) {
    if (to.path == '/home' || to.path == '/loan') {
      this.currentIndex = 1;
    }
    if (to.path == '/bill') {
      this.currentIndex = 2;
    }
    if (to.path == '/mine') {
      this.currentIndex = 3;
    }
    next();
  },
  data() {
    return {
      currentIndex: 1
    };
  },
  methods: {
    chanegIndex(index) {
      let user = this.$storage.get('user');
      if (!user || !user.code) {
        this.$hybrid.action('gotologin');
      } else {
        this.currentIndex = index;
        let path = '/loan';
        if (index == 1) {
          path = '/loan';
        };
        if (index == 2) {
          path = '/bill';
        };
        if (index == 3) {
          path = '/mine';
        }
        this.$router.replace(path);
      }
    }
  },
};
</script>
<style lang="scss">
@import './index.scss';
</style>